/**
 * webpack 的默认配置文件
 */
const path = require("path");

module.exports = {
  // 配置项
  mode: "production",

  // 入口配置
  // entry: "./src/main.js",
  entry: {
    app: "./src/main.js",
  },

  // 出口配置
  output: {
    // // 文件名
    // filename: "a.js",
    // // 文件夹, 必须提供一个绝对路径
    // path: path.resolve(__dirname, "./my-dist"),

    /**
     * 文件名 - 占位符 [xxxx]
     *    1. [name]       - main
     *    2. [hash]       - ???? 随机值（源代码有改动时会生成不同的字符）
     *    3. [fullhash]
     *        app-09a57f3861c7359b7394.js
     *        app-09a57f3861c7359b7394.js
     *        app-dd246be16a1323f1226e.js
     */
    filename: "[name]-[fullhash].js",
  },

  // module
  module: {
    // loader 处理规则
    rules: [
      {
        // 正则，正则匹配的文件后缀
        test: /\.css$/,
        // 要使用的 loader .
        //    下面这两个 loader 的执行顺序：
        //        1. css-loader 处理 css 后缀的文件，转换成 js 文件
        //        2. style-loader 将 css-loader 处理之后的内容，再写入到html的style标签中
        //    数组的后面是最先执行的
        use: ["style-loader", "css-loader"],
      },
      {
        test: /\.scss$/,
        use: ["style-loader", "css-loader", "sass-loader"],
      },
    ],
  },
};
